

<template>
  <div class="h100 f f-col">
    <div class="f j-b a-c pl20 pr20 f16" style="min-height:50px;">
      <div @click="timeShow = true">本月
        <van-icon name="arrow-down"/>
      </div>
      <div>筛选</div>
    </div>
    <div class="h100 scroll">
      <van-cell
        v-for="(item) in 10"
        :key="item"
        title="扫码点单-收益"
        value="+18"
        size="large"
        label="03:56"
      />
    </div>
    <van-popup v-model="timeShow" position="bottom" :style="{ height: '30%' }">
      <van-datetime-picker
        v-model="currentDate"
        type="year-month"
        :min-date="minDate"
        :max-date="maxDate"
        :formatter="formatter"
      />
    </van-popup>
  </div>
</template>

<script>
export default {
  data() {
    return {
      timeShow: false,
      minDate: new Date(2020, 0, 1),
      maxDate: new Date(2025, 10, 1),
      currentDate: new Date()
    };
  },
  methods: {
    formatter(type, val) {
      if (type === "year") {
        return `${val}年`;
      } else if (type === "month") {
        return `${val}月`;
      }
      return val;
    }
  }
};
</script>

